
import { View } from '@tarojs/components';
import Taro, { } from '@tarojs/taro';
import { ReactNode } from 'react';
import * as styles from './index.module.less';
interface AlertProps {
    children: ReactNode;
    /**
     * 取消文字
     */
    cancleText?: string,
    /**
     * 取消文字颜色
     */
    cancleColor?: string,
    /**
     * 确定文字
     */
    okText?: string,
    /**
     * 确定文字颜色
     */
    okColor?: string,
    /**
     * 标题
     */
    title: string,
    suceess: () => void
    cancle: () => void

}

// export default class Alert extends Component<AlertProps> {
//     static options = {
//         addGlobalClass: true
//     };

//     state = {
//     };

//     render() {
//         const obj = this.props
//         return (
//             <View className={styles.alert}>
//                 < View className={styles.alertMain}>
//                     <View className={styles.title}>{obj.title || '标题'}</View>
//                     <View>{obj.children}</View>
//                     <View className={styles.bottom}>
//                         <View className={styles.leftText} style={{ color: obj.cancleColor }} onClick={obj.cancle}>{obj.cancleText || '取消'}</View>
//                         <View className={styles.rightText} style={{ color: obj.okColor }} onClick={obj.suceess}>{obj.okText || '确定'}</View>
//                     </View>
//                 </View>
//             </View>
//         );
//     }
// }
const Alert: Taro.FC<AlertProps> = (props: AlertProps) => {
    return (
        < View className={styles.alert} >
            < View className={styles.alertMain}>
                <View className={styles.title}>{props.title || '标题'}</View>
                <View>{props.children}</View>
                <View className={styles.bottom}>
                    <View className={styles.leftText} style={{ color: props.cancleColor }} onClick={props.cancle}>{props.cancleText || '取消'}</View>
                    <View className={styles.rightText} style={{ color: props.okColor }} onClick={props.suceess}>{props.okText || '确定'}</View>
                </View>
            </View>
        </View >
    )
}
export default Alert
